<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="lib/Hui-iconfont/1.0.8/iconfont.min.css" id="skin" />
<title>Insert title here</title>
<style>
	*{
		background-color: #eeeeee;
		color:#2e61ca;
	}
	.div_1,.div_2,.div_3,.div_4,.div_5{
		display: none;
	}
	a{
		display: block;
		width:200px;
		margin-bottom:20px;
		text-decoration: none;
		border-bottom: 1px solid #d5d5d8;
		border-right: 1px solid #d5d5d8;
	}
	a{
		transition: all 0.3s;
	}
	a:hover{
		font-size:20px;
	} 
</style>
</head>
<body>
	<div class="div1">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;前台管理</a>
	</div>
	<div class="div_1">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;预定</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;开房</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;退房</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;结算</a>
	</div>
	<div class="div2">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;客房管理</a>
	</div>
	<div class="div_2">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
	</div>
		<div class="div3">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;库存管理</a>
	</div>
	<div class="div_3">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
	</div>
	<div class="div4">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;员工管理</a>
	</div>
	<div class="div_4">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
	</div>
	<div class="div5">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;财务管理</a>
	</div>
	<div class="div_5">
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
		<a href="">&nbsp;&nbsp;<i class="Hui-iconfont">&#xe616;</i>&nbsp;&nbsp;###</a>
	</div>
</body>
<script type="text/javascript" src="jquery/jquery-1.8.3.js"></script>
<script>
	$(function(){
		$(".div1").toggle(function(){
			$(".div_1").slideDown('1000');
		},function(){
			$(".div_1").slideUp('1000');
		});
		$(".div2").toggle(function(){
			$(".div_2").slideDown('1000');
		},function(){
			$(".div_2").slideUp('1000');
		});
		$(".div3").toggle(function(){
			$(".div_3").slideDown('1000');
		},function(){
			$(".div_3").slideUp('1000');
		});
		$(".div4").toggle(function(){
			$(".div_4").slideDown('1000');
		},function(){
			$(".div_4").slideUp('1000');
		});
		$(".div5").toggle(function(){
			$(".div_5").slideDown('1000');
		},function(){
			$(".div_5").slideUp('1000');
		});
	})
</script>
</html>